import React, { Component} from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import * as utils from '@/utils/index.js'
import { bindActionCreators } from 'redux'
// import actionsC from '@/store/actions.js'
import PanleProperty from '@/components/panel/panel-property'
import PanleStyle from '@/components/panel/panel-style'
import PanelSelector from '@/components/panel/panel-selector'
import PanelChildren from '@/components/panel/panel-children'
import PanelInsert from '@/components/panel/panel-insert'
import PanelTag from '@/components/panel/panel-tag'
import PanelFlow from '@/components/panel/panel-flow'
import PanelPositionBy from '@/components/panel/panel-position-by'
import IScroll from 'iscroll'
import { observer, inject } from 'mobx-react'

// let nodeActions=actionsC()
var panelScroll = {}

@inject('rootStore')
@observer
class LayoutPanel extends Component {
	constructor(props) {
		super(props);
	}
	componentWillReceiveProps(nextProp){
	}
	componentDidMount(){
		setTimeout(()=>{
			window.panelScroll = new IScroll('#layout-panel', {
				mouseWheel: true,
				scrollbars: true,
				preventDefault: false,
			});
		},0)
	}
	handleMouseDown(e){
		e.preventDefault()
		e.stopPropagation();
	}
	render() {
		return (
			<div className="layout-panel" id="layout-panel" ref="panel" >
				<div className="scroll-body">
					<PanelInsert />
					{/* <PanleProperty  onMouseMove={this.handleMouseDown.bind(this)} />
					<PanleStyle /> */}
					{/*
					
					<PanelSelector />
					<PanelFlow />
					<PanelPositionBy />
					*/}
					<PanelChildren /> 
				</div>
			</div>
		)
	}
}

LayoutPanel.defaultProps = {
};

// function mapStateToProps(state) {
// 	return {
// 	}
// }

// function mapDispatchToProps(dispatch) {
// 	return {
// 		dispatch: bindActionCreators(nodeActions, dispatch),
// 	}
// }

// export default connect(
// 	mapStateToProps,
// 	mapDispatchToProps
// )(LayoutPanel)

export default LayoutPanel

